
import React,{Fragment} from 'react';
import { Modal } from 'antd';
import './reset.less';

class ImageModal extends React.Component {
    state = {
        previewVisible: false,
    }
    showPreview = () => {
        this.setState({
            previewVisible: true,
        });
    }
    cancelPreview = () => {
        this.setState({
            previewVisible: false,
        });
    }
    render() {
        return (
            <Fragment>
                <img src={this.props.src} onClick={this.showPreview.bind(this)} width={this.props.width || 60} />
                <Modal className="reset-close" visible={this.state.previewVisible} footer={null}  onCancel={this.cancelPreview}>
                    <img src={this.props.src} style={{ width: '100%' }} />
                </Modal>
            </Fragment>
        );
    }
}

export default ImageModal;
